<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Intro to web design foundations demo</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- Custom styles for this scaffold -->
    <link href="static/css/theme.css" rel="stylesheet">
    <link href="static/css/site.css" rel="stylesheet">

</head>

<body>
<h1 style="text-align:center;"><a href="index.html">Design Foundations: Selectors</a></h1>
<div class="content">

    <div style="text-align: center;">
        <form style="display: inline-block;">
            <input class="form-control" type="text" id="search_entry" style="width: 350px; display: inline-block;"
                   placeholder="Enter CSS selector">
            <button type="submit" id="search_button" class="btn btn-success">Find elements</button>
        </form>
        <button class="btn btn-default" data-toggle="modal" data-target="#myModal">What elements can I
            use?
        </button>
        <br>
    </div>
    <hr>
    <br>
    <div class="test_content">
        <style>
            .course-img img {
                width: 64px;
            }

            .course-img {
                display: inline-block;
            }
        </style>
        <div class="col-lg-10 col-lg-offset-1 col-sm-12">
            <div style="text-align: center;">
                <h3 style="margin-top: 0px">Take Python to the next level with my online courses</h3>

                <div class="course-img">
                    <a href="https://talkpython.fm/course" id="jumpstart" class="light-access-link">
                        <img src="https://talkpython.fm/static/img/courses/python-jumpstart.jpg?cacheId=d4cd665291fd60bd84105ad3348c3c8e"
                             class="img sm"><br>
                        Jumpstart
                    </a>
                </div>

                <div class="course-img">
                    <a href="https://talkpython.fm/pythonic" id="pythonic" class="light-access-link">
                        <img src="https://talkpython.fm/static/img/courses/pythonic-code-course.png?cacheId=69a7763e882c3bb81ab9860e4cb16a1c"
                             class="img sm"><br>
                        Pythonic code
                    </a>
                </div>

                <div class="course-img">
                    <a href="https://talkpython.fm/launch" id="launch" class="light-access-link">
                        <img src="https://talkpython.fm/static/img/courses/python-for-entrepreneurs.png?cacheId=8ccc81c4f9856b1a9bc0aa3e90ccab2e"
                             class="img sm"><br>
                        Entrepreneurs
                    </a>
                </div>
                <div class="clearfix"></div>

            </div>


            <a class="btn btn-danger" style="color: white; float: right; margin-top: 2em;"
               href="https://itunes.apple.com/us/podcast/talk-python-to-me-python-conversations/id979020229"
               target="_blank"><i class="fa fa-apple"></i> Subscribe @ iTunes</a>

            <h1>Recorded episodes</h1>


            <table class="table table-hover episodes">
                <thead>
                <tr>
                    <th style="width: 120px; white-space: nowrap;">Show number</th>
                    <th>Date</th>
                    <th>Title</th>
                    <th>Guests</th>
                </tr>
                </thead>
                <tbody>

                <tr id="latest_episode" class="this_month">
                    <td style="text-align: center   ">#203</td>
                    <td class="text-muted date-text">2019-03-13</td>
                    <td><a href="https://talkpython.fm/episodes/show/203/beginners-and-experts-in-software-development">Beginners
                        and Experts
                        in Software Development</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>
                <tr class="this_month">
                    <td style="text-align: center   ">#202</td>
                    <td class="text-muted date-text">2019-03-09</td>
                    <td><a href="https://talkpython.fm/episodes/show/202/building-a-software-business">Building a
                        software business</a></td>
                    <td style="white-space: nowrap;">Ines Montani</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#201</td>
                    <td class="text-muted date-text">2019-02-27</td>
                    <td><a href="https://talkpython.fm/episodes/show/201/choosing-jupyterhub-and-python-over-matlab">Choosing
                        JupyterHub and
                        Python over MATLAB</a></td>
                    <td style="white-space: nowrap;">Peter Kazarinoff</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#200</td>
                    <td class="text-muted date-text">2019-02-21</td>
                    <td><a href="https://talkpython.fm/episodes/show/200/escaping-excel-hell-with-python-and-pandas">Escaping
                        Excel Hell with
                        Python and Pandas</a></td>
                    <td style="white-space: nowrap;">Chris Moffitt</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#199</td>
                    <td class="text-muted date-text">2019-02-14</td>
                    <td><a href="https://talkpython.fm/episodes/show/199/automate-all-the-things-with-python-at-zapier">Automate
                        all the
                        things with Python at Zapier</a></td>
                    <td style="white-space: nowrap;">Bryan Helmig</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#198</td>
                    <td class="text-muted date-text">2019-02-09</td>
                    <td><a href="https://talkpython.fm/episodes/show/198/catching-up-with-the-anaconda-distribution">Catching
                        up with the
                        Anaconda distribution</a></td>
                    <td style="white-space: nowrap;">Peter Wang</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#197</td>
                    <td class="text-muted date-text">2019-02-02</td>
                    <td><a href="https://talkpython.fm/episodes/show/197/modern-python-standard-library-cookbook">Modern
                        Python Standard
                        Library Cookbook</a></td>
                    <td style="white-space: nowrap;">Alessandro Molina</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#196</td>
                    <td class="text-muted date-text">2019-01-23</td>
                    <td><a href="https://talkpython.fm/episodes/show/196/datalore-hosted-smart-notebooks">Datalore:
                        Hosted smart
                        notebooks</a></td>
                    <td style="white-space: nowrap;">Adam Hood</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#195</td>
                    <td class="text-muted date-text">2019-01-20</td>
                    <td><a href="https://talkpython.fm/episodes/show/195/teaching-python-at-apple">Teaching Python at
                        Apple</a></td>
                    <td style="white-space: nowrap;">Ronald Hayden</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#194</td>
                    <td class="text-muted date-text">2019-01-11</td>
                    <td><a href="https://talkpython.fm/episodes/show/194/learning-and-teaching-python-in-a-vacuum">Learning
                        (and teaching)
                        Python in a vacuum</a></td>
                    <td style="white-space: nowrap;">Rusti Gregory</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#193</td>
                    <td class="text-muted date-text">2018-12-31</td>
                    <td><a href="https://talkpython.fm/episodes/show/193/data-science-year-in-review-2018-edition">Data
                        Science Year in
                        Review 2018 Edition</a></td>
                    <td style="white-space: nowrap;">Jonathon Morgan</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#192</td>
                    <td class="text-muted date-text">2018-12-26</td>
                    <td><a href="https://talkpython.fm/episodes/show/192/python-year-in-review-2018-edition">Python Year
                        in Review 2018
                        Edition</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#191</td>
                    <td class="text-muted date-text">2018-12-18</td>
                    <td><a href="https://talkpython.fm/episodes/show/191/python-s-journey-at-microsoft">Python's journey
                        at Microsoft</a>
                    </td>
                    <td style="white-space: nowrap;">Steve Dower</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#190</td>
                    <td class="text-muted date-text">2018-12-11</td>
                    <td><a href="https://talkpython.fm/episodes/show/190/teaching-django">Teaching Django</a></td>
                    <td style="white-space: nowrap;">William Vincent</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#189</td>
                    <td class="text-muted date-text">2018-12-07</td>
                    <td><a href="https://talkpython.fm/episodes/show/189/war-stories-of-the-developer-evangelists">War
                        Stories of the
                        Developer Evangelists</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#188</td>
                    <td class="text-muted date-text">2018-12-01</td>
                    <td><a href="https://talkpython.fm/episodes/show/188/async-for-the-pythonic-web-with-sanic">Async
                        for the Pythonic web
                        with Sanic</a></td>
                    <td style="white-space: nowrap;">Adam Hopkins</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#187</td>
                    <td class="text-muted date-text">2018-11-20</td>
                    <td><a href="https://talkpython.fm/episodes/show/187/secure-all-the-things-with-hubblestack">Secure
                        all the things with
                        HubbleStack</a></td>
                    <td style="white-space: nowrap;">Colton Myers</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#186</td>
                    <td class="text-muted date-text">2018-11-16</td>
                    <td><a href="https://talkpython.fm/episodes/show/186/100-days-of-python-in-a-magical-universe">100
                        Days of Python in a
                        Magical Universe</a></td>
                    <td style="white-space: nowrap;">Anna-Lena Popkes</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#185</td>
                    <td class="text-muted date-text">2018-11-09</td>
                    <td><a href="https://talkpython.fm/episodes/show/185/creating-a-python-3-culture-at-facebook">Creating
                        a Python 3 Culture
                        at Facebook</a></td>
                    <td style="white-space: nowrap;">Jason Fried</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#184</td>
                    <td class="text-muted date-text">2018-11-02</td>
                    <td><a href="https://talkpython.fm/episodes/show/184/teaching-python-with-bbc-micro-bit">Teaching
                        Python with BBC
                        micro:bit</a></td>
                    <td style="white-space: nowrap;">Nicholas Tollervey</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#183</td>
                    <td class="text-muted date-text">2018-10-24</td>
                    <td><a href="https://talkpython.fm/episodes/show/183/qt-for-python">Qt for Python</a></td>
                    <td style="white-space: nowrap;">Cristián Maureira-Fredes</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#182</td>
                    <td class="text-muted date-text">2018-10-17</td>
                    <td><a href="https://talkpython.fm/episodes/show/182/picture-python-at-shutterfly">Picture Python at
                        Shutterfly</a></td>
                    <td style="white-space: nowrap;">Doug Farrell</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#181</td>
                    <td class="text-muted date-text">2018-10-12</td>
                    <td><a href="https://talkpython.fm/episodes/show/181/30-amazing-python-projects">30 amazing Python
                        projects</a></td>
                    <td style="white-space: nowrap;">Brian Okken</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#180</td>
                    <td class="text-muted date-text">2018-10-02</td>
                    <td><a href="https://talkpython.fm/episodes/show/180/what-s-new-in-python-3.7-and-beyond">What's new
                        in Python 3.7 and
                        beyond</a></td>
                    <td style="white-space: nowrap;">Anthony Shaw</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#179</td>
                    <td class="text-muted date-text">2018-09-26</td>
                    <td><a href="https://talkpython.fm/episodes/show/179/python-language-summit-2018">Python Language
                        Summit 2018</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#178</td>
                    <td class="text-muted date-text">2018-09-21</td>
                    <td><a href="https://talkpython.fm/episodes/show/178/coverage.py">Coverage.py</a></td>
                    <td style="white-space: nowrap;">Ned Batchelder</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#177</td>
                    <td class="text-muted date-text">2018-09-15</td>
                    <td><a href="https://talkpython.fm/episodes/show/177/flask-goes-1.0">Flask goes 1.0</a></td>
                    <td style="white-space: nowrap;">David Lord</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#176</td>
                    <td class="text-muted date-text">2018-09-10</td>
                    <td><a href="https://talkpython.fm/episodes/show/176/the-python-community-by-the-numbers">The Python
                        Community by the
                        Numbers</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#175</td>
                    <td class="text-muted date-text">2018-08-31</td>
                    <td><a href="https://talkpython.fm/episodes/show/175/teaching-python-to-network-engineers">Teaching
                        Python to network
                        engineers</a></td>
                    <td style="white-space: nowrap;">Hank Preston III</td>

                </tr>
                <tr>
                    <td style="text-align: center   ">#174</td>
                    <td class="text-muted date-text">2018-08-16</td>
                    <td>
                        <a href="https://talkpython.fm/episodes/show/174/coming-into-python-from-another-industry-part-2">Coming
                            into Python
                            from another Industry (part 2)</a></td>
                    <td style="white-space: nowrap;">Panelists</td>

                </tr>

                </tbody>
            </table>
        </div>

    </div>

    <div class="modal fade" id="myModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">Here is some content we can select</h4>
                </div>
                <div class="modal-body">
                    <ul style="width: auto; text-align: left; display: inline-block">
                        <li>id: latest_episode</li>
                        <li>class: this_month</li>
                        <li>class: course-img</li>
                        <li>id: jumpstart</li>
                        <li>id: pythonic</li>
                        <li>id: launch</li>
                        <li>Element: tr</li>
                        <li>Element: td</li>
                        <li>Element: th</li>
                        <li>Element: body</li>
                        <li>Element: div</li>
                    </ul>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

</div>


<script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-3.0.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="static/js/selectors.js"></script>
</body>
</html>
